<template>
  <div>
    <el-input v-model:modelValue="userName" @update:modeValue="handleInput"></el-input>
    <el-button @click="handleSubmit">提交测试</el-button>
  </div>
</template>

<script>
import { ref } from "@vue/reactivity";
export default {
  name: "VInput",
  props: ["modelValue", "title"],
  // 接收父元素传递的
  setup(props, context) {
    let userName = ref(props.modelValue);

    const handleInput = (val) => {
      userName.value = val;
      context.emit("update:modeValue", val);
    };

    const handleSubmit = (value) => {
      context.emit("handleSubmit", userName);
    };

    return {
      userName,
      handleSubmit,
      handleInput,
    };
  },
};
</script>

<style>
</style>